<template>
  <van-tabbar v-model="selected" fixed>
    <van-tabbar-item v-for="(item,i) of tabbarItems" :key="i"
                     :name="item.path"
                     :icon="item.icon"
                     @click="onChange(i)">{{ item.title }}</van-tabbar-item>
  </van-tabbar>
</template>

<script>
export default {
  data() {
    return {
      selected:'/',
      tabbarItems: [
        {
          title: '首页',
          routeName: 'home',
          icon: 'home-o',
          path: '/'
        },
        {
          title: '商品',
          routeName: 'product',
          icon: 'gift-o',
          path: '/list'
        },
        {
          title: '我的',
          routeName: 'user',
          icon: 'user-o',
          path: '/user'
        }
      ]
    };
  },
  created() {

    this.selected=window.location.href.substring(window.location.href.lastIndexOf('/'))
    console.log(this.selected)
  },
  methods: {
    onChange(index) {
      this.$router.push({
        name: this.tabbarItems[index].routeName
      });
    }
  }
};
</script>